<script setup>
import Count2 from "./components/Count2.vue";
import Count1 from "./components/Count1.vue";
import Chazhibiaodashi from "./components/chazhibiaodashi.vue";
import Wenbenxuanran from "./components/wenbenxuanran.vue";
import Shuxingxuanran from "./components/shuxingxuanran.vue";
import Shijianbangding from "./components/shijianbangding.vue";
import Xiangyingshiguanjianzikuozhan from "./components/xiangyingshiguanjianzikuozhan.vue";
import Tiaojianxuanran from "./components/tiaojianxuanran.vue";
import Shuangxiangbangding from "./components/shuangxiangbangding.vue";
import Leibiaxuanran from "./components/leibiaxuanran.vue";
import Shuxingjisuan from "./components/shuxingjisuan.vue";
import Shujujiantingqi from "./components/shujujiantingqi.vue";
import Shengmingzhouqi from "./components/shengmingzhouqi.vue";
</script>

<template>
  <div>
    <h1>Count1:</h1>
    <Count1></Count1>
    <h1> Count2:</h1>
    <Count2></Count2>
    <br>
    <h1> 插值表达式:</h1>
    <chazhibiaodashi></chazhibiaodashi>
    <br>
    <h1> 文本渲染:</h1>
    <wenbenxuanran></wenbenxuanran>
    <br>
    <h1>属性渲染:</h1>
    <shuxingxuanran></shuxingxuanran>
    <br>
    <h1>事件绑定：</h1>
    <shijianbangding></shijianbangding>
    <br>
    <h1> toRef和toRefs</h1>
    <xiangyingshiguanjianzikuozhan></xiangyingshiguanjianzikuozhan>
    <br>
    <h1>条件渲染：</h1>
    <tiaojianxuanran></tiaojianxuanran>
    <br>
    <h1> 列表渲染：</h1>
    <leibiaxuanran></leibiaxuanran>
    <br>
    <h1> 双向绑定：</h1>
    <shuangxiangbangding></shuangxiangbangding>
    <br>
    <h1> 属性计算：</h1>
    <shuxingjisuan></shuxingjisuan>
    <br>
    <h1>数据监听器</h1>
    <shujujiantingqi></shujujiantingqi>
    <br>
    <h1>生命周期</h1>
    <shengmingzhouqi></shengmingzhouqi>
  </div>

</template>

<style scoped>

</style>
